<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition template="/resources/template/template.xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:hr="http://java.sun.com/jsf/composite/autocomplete"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.org/ui"
                xmlns:pe="http://primefaces.org/ui/extensions"
                xmlns:f="http://java.sun.com/jsf/core">


    <ui:define name="content">

        <h:panelGroup >
            <h:form  >

                <h:panelGrid columns="2" >
                    <p:panel header="Detail" >
                        <h:panelGrid columns="2"  >

                            <h:outputLabel value="Staff Name"/>
                            <p:autoComplete  forceSelection="true" 
                                             value="#{staffBasicController.current.staff}"
                                             completeMethod="#{staffController.completeStaffCode}" var="mys" itemLabel="#{mys.person.nameWithTitle}" itemValue="#{mys}"
                                             converter="stfcon"   >   
                                <f:ajax event="itemSelect" execute="@this" render="tb7 stfCode stfCode2" listener="#{staffBasicController.makeItemNul}" />
                                <p:column headerText="Staff Name">
                                    <h:outputLabel value="#{mys.person.name}"/>
                                </p:column>
                                <p:column headerText="Code">
                                    <h:outputLabel value="#{mys.code}"/>
                                </p:column>

                            </p:autoComplete>
                            <p:outputLabel value="Emp Code"></p:outputLabel>
                            <p:outputLabel id="stfCode" value="#{staffBasicController.current.staff.code}"></p:outputLabel>
                            <p:outputLabel value="EPF Code"></p:outputLabel>
                            <p:outputLabel id="stfCode2" value="#{staffBasicController.current.staff.epfNo}"></p:outputLabel>
                            <h:outputLabel value="From"/>
                            <p:calendar id="frm" navigator="true" value="#{staffBasicController.current.fromDate}" pattern="dd MM yyyy" >                                
                            </p:calendar>
                            <h:outputLabel value="To"/>
                            <p:calendar id="to" navigator="true"  value="#{staffBasicController.current.toDate}" pattern="dd MM yyyy">                                      
                            </p:calendar>                    
                            <h:outputLabel value="Salary"/>
                            <p:inputText autocomplete="off"  value="#{staffBasicController.current.staffPaySheetComponentValue}"/>

                            <h:outputLabel value="BR Value"/>
                            <p:inputText autocomplete="off"  value="#{staffBasicController.current.dblValue}"/>

                            <p:commandButton id="btnAdd" value="Save" action="#{staffBasicController.save}" ajax="false" onclick="onSubmitButton();"/>
                            <p:commandButton value="Clear" action="#{staffBasicController.makeNull}" ajax="false" onclick="onSubmitButton();" />

                        </h:panelGrid>
                    </p:panel>

                </h:panelGrid>


                <p:spacer height="30" />

                <p:panel>
                    <f:facet name="header">
                        <h:outputLabel value="Basic List"/>
                        <p:commandButton value="Refresh" action="#{staffBasicController.makeItemNul}" ajax="false" style="float: right;" onclick="onSubmitButton();"/>

                    </f:facet>
                    <h:panelGrid columns="2" >
                        <h:outputLabel value="From : " />
                        <p:calendar value="#{staffBasicController.fromDate}"
                                    navigator="true"
                                    pattern="dd MMMM yyyy hh:mm:ss a" />                                          
                        <h:outputLabel value="Employee : "/>
                        <hr:completeStaff value="#{staffBasicController.reportKeyWord.staff}"/>
                        <h:outputLabel value="Department : "/>
                        <hr:department value="#{staffBasicController.reportKeyWord.department}"/>
                        <h:outputLabel value="Institution : "/>
                        <hr:institution value="#{staffBasicController.reportKeyWord.institution}"/>
                        <h:outputLabel value="Staff Category : "/>
                        <hr:completeStaffCategory value="#{staffBasicController.reportKeyWord.staffCategory}"/>
                        <h:outputLabel value="Designation : "/>
                        <hr:completeDesignation value="#{staffBasicController.reportKeyWord.designation}"/>
                        <h:outputLabel value="Roster : "/>
                        <hr:completeRoster value="#{staffBasicController.reportKeyWord.roster}"/> 


                        <h:panelGrid columns="3"> 
                            <p:commandButton ajax="false" value="Fill" action="#{staffBasicController.createBasicTable}" />
                            <p:commandButton ajax="false" value="Excel" styleClass="noPrintButton" onclick="onSubmitButton();" >
                                <pe:exporter type="xlsx" target="tb7" fileName="hr_staff_basic_individual"  />
                            </p:commandButton>
                            <p:commandButton value="Print" ajax="false" action="#" >
                                <p:printer target="staffbasic" ></p:printer>
                            </p:commandButton>
                        </h:panelGrid>
                    </h:panelGrid>
                    <p:panel id="staffbasic" styleClass="noBorder summeryBorder" >
                        <p:dataTable id="tb7"  value="#{staffBasicController.items}" 
                                     filteredValue="#{staffBasicController.filteredStaffPaysheet}"
                                     var="i"  selection="#{staffBasicController.selectedStaffComponent}" 
                                     rowKey="#{i.id}" rowIndexVar="a" >
                            <f:facet name="header">
                                <h:outputLabel value="Employee Basic"/>
                            </f:facet>
                            <p:column  selectionMode="multiple" styleClass="noPrintButton">                            
                            </p:column>
                            <p:column headerText="No">
                                <f:facet name="header">
                                    <h:outputLabel value="No"/>
                                </f:facet>
                                <h:outputLabel value="#{a+1}" >
                                </h:outputLabel>
                            </p:column>

                            <p:column headerText="Institution" sortBy="#{i.staff.workingDepartment.institution.name}"  >
                                <f:facet name="header" >
                                    <h:outputLabel value="Institution"  />
                                </f:facet>
                                <h:outputLabel value="#{i.staff.workingDepartment.institution.name}" ></h:outputLabel>
                            </p:column>
                            <p:column headerText="Department" sortBy="#{i.staff.workingDepartment.name}" >
                                <f:facet name="header" >
                                    <h:outputLabel value="Department"  />
                                </f:facet>

                                <h:outputLabel value="#{i.staff.workingDepartment.name}" ></h:outputLabel>
                            </p:column>
                            <p:column headerText="Roster"  >
                                <f:facet name="header">
                                    <h:outputLabel value="Roster"  />
                                </f:facet>
                                <h:outputLabel value="#{i.staff.roster.name}" ></h:outputLabel>
                            </p:column>
                            <p:column headerText="EMP Code" sortBy="#{i.staff.codeInterger}" >
                                <f:facet name="header">
                                    <h:outputLabel value="EMP Code"  />
                                </f:facet>
                                <h:outputLabel value="#{i.staff.code}" ></h:outputLabel>
                            </p:column>
                            <p:column headerText="DOJ"  >
                                <f:facet name="header">
                                    <h:outputLabel value="DOJ"  />
                                </f:facet>
                                <h:outputLabel value="#{i.staff.dateJoined}" >
                                    <f:convertDateTime pattern="dd MMMM yyyy"/>
                                </h:outputLabel>
                            </p:column>
                            <p:column headerText="From"  >
                                <f:facet name="header">
                                    <h:outputLabel value="From"  />
                                </f:facet>
                                <h:outputLabel value="#{i.fromDate}" >
                                    <f:convertDateTime pattern="dd MMMM yyyy"/>
                                </h:outputLabel>
                            </p:column>
                            <p:column headerText="To" >
                                <f:facet name="header">
                                    <h:outputLabel value="To"  />
                                </f:facet>
                                <p:cellEditor>  
                                    <f:facet name="output">
                                        <h:outputLabel value="#{i.toDate}">
                                            <f:convertDateTime pattern="dd MMMM yyyy"/>
                                        </h:outputLabel>
                                    </f:facet>
                                    <f:facet name="input">
                                        <p:calendar  navigator="true" value="#{i.toDate}"  pattern="dd MMMM yyyy" />
                                    </f:facet>
                                </p:cellEditor>

                            </p:column>

                            <p:column headerText="Grade" >
                                <f:facet name="header">
                                    <h:outputLabel value="Grade"  />
                                </f:facet>
                                <h:outputLabel value="#{i.staff.grade.name}"/>                           
                            </p:column>

                            <p:column headerText="Category" >
                                <f:facet name="header">
                                    <h:outputLabel value="Category"  />
                                </f:facet>
                                <h:outputLabel value="#{i.staff.staffCategory.name}"/>
                            </p:column>

                            <p:column headerText="Designtion" >
                                <f:facet name="header">
                                    <h:outputLabel value="Designtion"  />
                                </f:facet>
                                <h:outputLabel value="#{i.staff.designation.name}"/>
                            </p:column>
                            <p:column headerText="Resign Date" >
                                <f:facet name="header">
                                    <h:outputLabel value="Resign Date"  />
                                </f:facet>
                                <h:outputLabel value="#{i.staff.dateLeft}">
                                    <f:convertDateTime pattern="dd MMMM yyyy"/>
                                </h:outputLabel>
                            </p:column>
                            <p:column headerText="Staff" >
                                <f:facet name="header">
                                    <h:outputLabel value="Staff"  />
                                </f:facet>
                                <h:outputLabel value="#{i.staff.person.nameWithTitle}"/>
                            </p:column>
                            <p:column headerText="Basic" sortBy="#{i.staffPaySheetComponentValue}" >
                                <f:facet name="header">
                                    <h:outputLabel value="Basic"  />
                                </f:facet>
                                <h:outputLabel value="#{i.staffPaySheetComponentValue}">
                                    <f:convertNumber pattern="#,##0.00" />
                                </h:outputLabel>

                            </p:column>
                            <p:column headerText="BR Value"  >
                                <f:facet name="header">
                                    <h:outputLabel value="BR Value"  />
                                </f:facet>
                                <h:outputLabel value="#{i.dblValue}">
                                    <f:convertNumber pattern="#,##0.00" />
                                </h:outputLabel>

                            </p:column>

                            <p:column style="width:6%" exportable="false" styleClass="noPrintButton">  
                                <p:commandButton ajax="false" value="Remove" action="#{staffBasicController.remove}" onclick="onSubmitButton();">
                                    <f:setPropertyActionListener target="#{staffBasicController.current}" value="#{i}" />
                                </p:commandButton>
                            </p:column>  

                            <p:column style="width:6%" exportable="false" styleClass="noPrintButton">  
                                <p:commandButton ajax="false" value="View" onclick="onSubmitButton();">
                                    <f:setPropertyActionListener target="#{staffBasicController.current}" value="#{i}" />
                                </p:commandButton>
                            </p:column> 
                        </p:dataTable>
                    </p:panel>
                </p:panel>
            </h:form>

        </h:panelGroup>

    </ui:define>

</ui:composition>
